
	<div class="nh-cases">
		<div class="nh-cases-nav" [@shiftCaseTree]="isVisible">
			<div class="row">
				<div class="col s3">
					<form materialize action="#" class="select-form">
						<select materialize="material_select" 
						[materializeSelectOptions]="selectedCase"
						(change)="getCaseEndpoint($event.target.value)">
						<option value="" disabled selected>Choose Case</option>
						<option *ngFor="let option of selectedCase" [value]="option.case_name">{{option.case_name}}</option>
					</select>
				</form>
			</div>
			<div class="col s3">
				<form materialize action="#" class="select-form">
					<select materialize="material_select" 
					[materializeSelectOptions]="selectedEndpoint"
					(change)="getCaseDateFromEndpoint($event.target.value)">
					<option value="" disabled selected>Choose Endpoint</option>
					<option *ngFor="let option of selectedEndpoint" [value]="option.key">{{option.key}} ({{option.doc_count}})</option>
				</select>
			</form>
		</div>
			<div class="col s3">
				<form materialize action="#" class="select-form">
					<select materialize="material_select" 
					[materializeSelectOptions]="selectedCaseDate"
					(change)="getAuditDateFromEndpoint($event.target.value)">
					<option value="" disabled selected>Choose Case Date</option>
					<option *ngFor="let option of selectedCaseDate" [value]="option.key_as_string">{{option.key_as_string}} ({{option.doc_count}})</option>
				</select>
			</form>
		</div>
		<div class="col s3">
			<form materialize action="#" class="select-form">
				<select materialize="material_select" 
				[materializeSelectOptions]="selectedAudit"
				(change)="getAuditDataFromAuditType($event.target.value)">
				<option value="" disabled selected>Choose Audit</option>
				<option *ngFor="let option of selectedAudit" [value]="option.key" >{{option.key}} ({{option.doc_count}})</option>
			</select>
		</form>
	</div>
</div>
</div>
</div>

<div id="modal1" materialize="modal" [materializeParams]="[{dismissible: false}]" [materializeActions]="modalActions" class="modal bottom-sheet modal-fixed-footer">
	<div class="modal-content" *ngIf="connError">
		<p class="flow-text">
			HTTP Status: {{connError.status}}, Error: {{connError.statusText}}
		</p>
	</div>
	<div class="modal-content" *ngIf="pTree">
		<app-nh-processtree [visualizeItem]="pTree"></app-nh-processtree>
	</div>
	<div class="modal-footer">
		<a class="waves-effect btn-flat ambertext" (click)="destroyModalObject()">Close</a>
	</div>
</div>